<template>
  <div>
    <hry-card
      v-for="(item, index) in data.product"
      :key="index"
      :info="item"
      ref="comment"
    ></hry-card>
    <div>
      <md-button type="default" round @click="comment">提交评价</md-button>
    </div>
  </div>
</template>

<script>
import { Button } from "mand-mobile";
export default {
  name: "comment",
  components: {
    [Button.name]: Button,
    hryCard: () => import("@/components/order/addComment")
  },
  data() {
    return {
      data: {}
    };
  },
  methods: {
    getInfo() {
      this.$ajax
        .post(
          this.$api.orderDetail,
          {
            order_id: this.$route.params.id
          },
          false
        )
        .then(res => {
          this.data = res.data.data;
        })
        .catch(err => {
          this.$toast.failed(err);
        });
    },
    comment() {
      let newArr = [];
      this.data.product.forEach((item, index) => {
        let info = this.$refs.comment[index].getInfo();
        if (info.content || info.url) {
          newArr.push(info);
        }
      });
      if (newArr.length > 0) {
        this.$ajax
          .post(
            this.$api.addComment,
            {
              order_id: this.$route.params.id,
              content_info: JSON.stringify(newArr)
            },
            false
          )
          .then(() => {
            this.$toast.succeed("感谢您的评价");
            this.$router.go(-1);
          })
          .catch(err => {
            this.$toast.failed(err);
          });
      }
    }
  },
  created() {
    this.getInfo();
  }
};
</script>

<style scoped lang="stylus"></style>
